<template>
  <div>
    <deerDefault ref="sub">
      <div slot="formHead" class="flexLeft flex1">
        <div class="datum">申报材料</div>
        <div class="datumItem flex1">
          <div>节目标题</div>
          <div style="height: 152px">节目类别</div>
          <div>节目长度</div>
          <div>首播平台</div>
          <div>录音设备</div>
          <div>录制方式</div>
        </div>
      </div>
      <div slot="formMain" class="formMain">
        <!-- 节目标题 -->
        <input
          :disabled="$store.state.iptDis"
          type="text"
          class="w100 borB borR"
          v-model="proGoldDeerRecord2.title"
        />
        <!-- 节目类别 -->
        <div class="borB w100" style="align-items: flex-start">
          <div class=" topTitle flex1">
            <div class="flex2 one borL">
              <!-- <div class="borB padTB5">音乐</div> -->
              <div class="">
                <div class="flex1 borL">
                  <!-- <div class="borB padTB5">器乐</div> -->
                  <div class="flexLeft" style="height: 151px;width:100%;">
                    <div class="rideoitem">
                      <a-radio-group v-model="proGoldDeerRecord2.kind">
                        <a-radio :value="1"> 1、语言 </a-radio>
                        <a-radio :value="2"> 2、音乐 </a-radio>
                        <a-radio :value="3"> 3、广播剧 </a-radio>
                        <a-radio :value="4"> 4、广告片 </a-radio>
                      </a-radio-group>
                    </div>

                    <!-- <div
                      class="flexLeft borR flexColumn flex1 item"
                      v-for="(i, k) in inst"
                      :key="k"
                    >
                      <div class="datum marB10">{{ i.label }}</div>
                      <input
                        type="radio"
                        v-model="proGoldDeerRecord2.kind"
                        :value="i.value"
                      />
                    </div> -->
                  </div>
                </div>
                <!-- <div class="flex1 borL">
                  <div class="borB padTB5">声乐</div>
                  <div class="flexLeft">
                    <div
                      class="flexLeft borL flexColumn flex1 item"
                      v-for="(i, k) in vocal"
                      :key="k"
                    >
                      <div class="datum marB10">{{ i.label }}</div>
                      <input
                        type="radio"
                        v-model="proGoldDeerRecord2.kind"
                        :value="i.value"
                      />
                    </div>
                  </div>
                </div> -->
              </div>
            </div>
            <!-- <div class="flex1 one borL">
              <div class="borB padTB5">语言</div>
              <div class="flexLeft">
                <div
                  class="flexLeft borR flexColumn flex1 item item1"
                  v-for="(i, k) in lang"
                  :key="k"
                >
                  <div class="datum marB10">{{ i.label }}</div>
                  <input
                    type="radio"
                    v-model="proGoldDeerRecord2.kind"
                    :value="i.value"
                  />
                </div>
              </div>
            </div> -->
          </div>
          <div class="flex1 flexLeft">
            <div
              class="flexLeft flex1 flexColumn borL pad5 let"
              v-for="(i, k) in options"
              :key="k"
            >
              <div class="datum marB10">{{ i.label }}</div>
              <input
                type="radio"
                v-model="proGoldDeerRecord2.kind"
                :value="i.value"
              />
            </div>
          </div>
        </div>
        <!-- 节目长度 -->
        <div class="borB flex1 flexLeft">
          <div class="flexLeft flex1">
            <input
              type="text"
              style="width: 60px"
              v-model="proGoldDeerRecord2.jmcdMin"
            />
            分
            <input
              type="text"
              style="width: 60px"
              v-model="proGoldDeerRecord2.jmcdSec"
            />
            秒
          </div>
          <div class="flexLeft flex1">
            <div class="awardName borL borR">首播日期</div>
            <div class="flexLeft flex1">
              <input
                type="text"
                style="width: 60px"
                v-model="proGoldDeerRecord2.sbrqn"
              />
              年
              <input
                type="text"
                style="width: 60px"
                v-model="proGoldDeerRecord2.sbrqy"
              />
              月
              <input
                type="text"
                style="width: 60px"
                v-model="proGoldDeerRecord2.sbrqr"
              />
              日
            </div>
          </div>
        </div>
        <!-- 首播平台 -->
        <div class="borB flex1 flexLeft">
          <input type="text" class="flex1" v-model="proGoldDeerRecord2.sbpt" />
          <div class="flexLeft flex1">
            <div class="awardName borL borR">首播链接</div>
            <input
              type="text"
              class="flex1"
              v-model="proGoldDeerRecord2.sblj"
            />
          </div>
        </div>
        <!-- 录音设备 -->
        <div class="borB flex1 flexLeft">
          <div class="padL10 flex1">
            <a-radio-group
              :options="num"
              class="flex1"
              v-model="proGoldDeerRecord2.lysb"
            />
          </div>
          <div class="flexLeft flex1" style="margin-left: -10px">
            <div class="awardName borL borR">同期录音</div>
            <div class="flex1 padL10">
              <a-radio-group
                name="radioGroup"
                v-model="proGoldDeerRecord2.tqly"
              >
                <a-radio :value="'1'"> 是 </a-radio>
                <a-radio :value="'2'"> 否 </a-radio>
              </a-radio-group>
            </div>
          </div>
        </div>
        <!-- 录制方式 -->
        <div class="flex1 flexLeft marL10" style="height: 43px">
          <a-radio-group name="radioGroup" v-model="proGoldDeerRecord2.lzfs">
            <a-radio :value="'1'"> 单声道 </a-radio>
            <a-radio :value="'2'"> 立体声 </a-radio>
            <a-radio :value="'3'"> 多轨 </a-radio>
          </a-radio-group>
        </div>
      </div>
    </deerDefault>
    <div style="margin-top:30px">
      <a-alert message="请注意:填写完申请后打印并盖章在附件列表上传" type="warning" />
    </div>
  </div>
</template>

<script>
import deerDefault from "@/components/deerAward/deerDefault.vue";
const options = [
  // { label: "戏曲", value: "10" },
  // { label: "曲艺", value: "11" },
  // { label: "广播剧", value: "12" },
  // { label: "片花", value: "13" },
  // { label: "广告", value: "14" },
  // { label: "环绕声", value: "15" },
  // { label: "网络音频", value: "16" },
];
export default {
  components: {
    deerDefault,
  },
  data() {
    return {
      options,
      v3: "aa",
      inst: [
        { label: "语言类", value: "1" },
        { label: "音乐类", value: "2" },
        { label: "广播剧类", value: "3" },
        { label: "广告片类", value: "4" },
      ],
      // vocal: [
      //   { label: "民族", value: "4" },
      //   { label: "美声", value: "5" },
      //   { label: "通俗", value: "6" },
      // ],
      // lang: [
      //   { label: "新闻", value: "7" },
      //   { label: "艺术", value: "8" },
      //   { label: "专题", value: "9" },
      // ],
      num: [
        { label: "数字", value: "1" },
        { label: "模拟", value: "2" },
        { label: "混合", value: "3" },
      ],
      proGoldDeerRecord: {
        fax: "",
        num: "",
        orgName: "",
        phone: "",
        postal: "",
        tel: "",
        zywcr: "",
        callName: "",
        cpdwName: "",
        address: "",
        titel: "",
        kind: "",
        jmcdMin: "",
        jmcdSec: "",
        lzfs: "",
        sbpt: "",
        tqly: "",
        sbrqn: "",
        sbrqy: "",
        sbrqr: "",
        sblj: "",
      },
      proGoldDeerRecord2: {
        titel: "",
        kind: "",
        jmcdMin: "",
        jmcdSec: "",
        lzfs: "",
        sbpt: "",
        tqly: "",
        sbrqn: "",
        sbrqy: "",
        sbrqr: "",
        sblj: "",
      },
      chil: {},
    };
  },
  methods: {
    gain() {
      let chil = this.$refs.sub;
      this.proGoldDeerRecord = {
        ...chil.reportData,
      };
      chil.reportData = this.proGoldDeerRecord2;

      Object.assign(this.proGoldDeerRecord, this.proGoldDeerRecord2);

      console.log(this.proGoldDeerRecord2);
    },
    empty() {
      let chil = this.$refs.sub;
      chil.reportData = {};
      this.proGoldDeerRecord2 = {};
    },
  },
};
</script>

<style lang="scss" scoped>
@import url("../../../assets/sass/components/form.scss");
.formMain {
  width: 100%;
  .w100 {
    width: 100%;
  }
  .let {
    letter-spacing: 5px;
    height: 151px;
    display: flex;
    justify-content: flex-end;
  }
  .topTitle {
    align-items: flex-start;
  }
  .category {
    left: 0;
    top: 0;
    flex: 5;
  }
  .one {
    text-align: center;
  }
  .item {
    height: 100%;
    width: 230px;
    justify-content: flex-end;
    padding-bottom: 15px;
    box-sizing: border-box;
  }
  .item1 {
    height: 120px;
  }
  .rideoitem{
      flex: 1;
  display: flex;
  justify-content: center;
  }
   .ant-radio-wrapper{
    margin-right: 24px !important;
  }
}
</style>